/* eslint-disable react/jsx-indent */
/* eslint-disable react/no-unused-state */
/* eslint-disable react/jsx-no-undef */
/* eslint-disable no-redeclare */
/* eslint-disable vars-on-top */
/* eslint-disable block-scoped-var */
/* eslint-disable array-callback-return */
/* eslint-disable no-param-reassign */
/* eslint-disable no-unused-expressions */
/* eslint-disable no-unused-vars */
/* eslint-disable no-shadow */
/* eslint-disable react/destructuring-assignment */
/* eslint-disable eqeqeq */
import React, { PureComponent } from 'react';
import { connect } from 'dva';
import moment from 'moment';
import { Form } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import { Card, DatePicker, Table, Modal, Input, message, Button, Select, Spin } from 'antd';
import Link from 'umi/link';
import PageHeaderWrapper from '@/components/PageHeaderWrapper';
import FooterToolbar from '@/components/FooterToolbar';
import DescriptionList from '@/components/DescriptionList';

const { Description } = DescriptionList;
const FormItem = Form.Item;
const { Option } = Select;
const { MonthPicker } = DatePicker;
const { TextArea } = Input;

@connect(({ addempreceiptrec, loading }) => ({
  data: addempreceiptrec.data,
  pdInfoDtos: addempreceiptrec.addempreceiptrec,
  loading: loading.models.addempreceiptrec,
  payDetailsData: addempreceiptrec.payDetailsData,
  confirmLoading: loading.effects['addempreceiptrec/fetchPayDetail'],
  switchs: addempreceiptrec.switch,
  insFlag: addempreceiptrec.insFlag,
}))
@Form.create()
class TableList extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      ideModalVisible: false,
      setInfosList: [],
      pdInfoDtosList: [],
      // eslint-disable-next-line react/no-unused-state
      pdInfoDtosListtwo: [],
      modalVisible: false,
      timeStart: '',
      recvTaskId: null,
      recvOrdPdId: '',
      recvOrdSetId: '',
      // switch: true,
      mapjis: true,
      maistrue: false,
      isModify: '',
      isModifyor: '1',
      opsitTypename: '',
      // eslint-disable-next-line react/no-unused-state
      catepaympersol: [],
      currentDate: '',

      insIdeData: [], // 缴费人员类别
      insIde: '', // 缴费人员类别id
    };
  }

  componentDidMount() {
    const { dispatch, location } = this.props;
    const { recvOrdAddTaskId } = location.query;
    const { isModify } = location.query;
    this.setState({
      recvTaskId: recvOrdAddTaskId,
      isModify,
    });
    dispatch({
      type: 'addempreceiptrec/updateModalData',
      payload: { switch: true },
    });
    dispatch({
      type: 'addempreceiptrec/receiptback',
      payload: { recvOrdAddTaskId },
    });
  }

  // 修改
  update = record => {
    this.props.form.resetFields();
    // this.props.form.setFieldsValue({ product: record.editDesc });
    this.setState({
      modalVisible: true,
      timeStart: record.sendBeginDate,
      limitTimeStart: record.oldBeginDate,
      recvOrdSetId: record.recvOrdAddSetId ? record.recvOrdAddSetId : '',
      recvOrdPdId: record.recvOrdAddPdId ? record.recvOrdAddPdId : '',
    });
  };

  // 模态框显隐
  handleModalVisible = flag => {
    this.setState({
      modalVisible: !!flag,
    });
  };

  // 回单
  receipt = record => {
    const { dispatch, data } = this.props;
    dispatch({
      type: 'addempreceiptrec/receiptId',
      payload: record.ass
        ? { ass: record.ass, recvOrdAddTaskId: data.recvOrdAddTaskId }
        : { pdId: record.pdId, recvOrdAddTaskId: data.recvOrdAddTaskId },
      callback: response => {
        if (response.success == true) {
          message.success('回单成功！');
          const { dispatch, location, data } = this.props;
          const { recvOrdAddTaskId } = location.query;
          this.setState({
            recvTaskId: recvOrdAddTaskId,
            // switch: true,
          });
          dispatch({
            type: 'addempreceiptrec/updateModalData',
            payload: { switch: true },
          });
          dispatch({
            type: 'addempreceiptrec/receiptback',
            payload: { recvOrdAddTaskId },
          });
        } else {
          message.warning(response.message || '回单失败!');
          const { dispatch, location, data } = this.props;
          const { recvOrdAddTaskId } = location.query;
          this.setState({
            recvTaskId: recvOrdAddTaskId,
          });
        }
      },
    });
  };

  // 分项回单
  subsett = record => {
    const { setInfosList, pdInfoDtosList } = this.state;
    const { dispatch, switchs } = this.props;
    const newsetInfosList = setInfosList.filter(item => item.ass !== 2); // 过滤公积金的数据
    if (switchs == true) {
      if (this.state.mapjis == true) {
        newsetInfosList.map((item, index) => {
          // eslint-disable-next-line no-sequences
          (item.pdName = item.assName),
            (item.cityName = record.cityName),
            (item.editFlagName = record.editFlagName),
            (item.ass = item.ass),
            (item.editFlag = record.editFlag),
            (item.recvOrdAddSetId = item.recvOrdAddSetId),
            pdInfoDtosList.splice(1, 0, item);
        });
      }
      const ll = [];
      pdInfoDtosList.map((item, index) => {
        if (item.recvOrdAddPdId) {
          ll.push(item);
        }
      });
      dispatch({
        type: 'addempreceiptrec/addpdInfoDtosList',
        payload: pdInfoDtosList,
      });
      dispatch({
        type: 'addempreceiptrec/updateModalData',
        payload: { switch: false },
      });

      this.setState({
        pdInfoDtosList,
      });
    } else {
      this.setState({
        pdInfoDtosList,
      });
      dispatch({
        type: 'addempreceiptrec/updateModalData',
        payload: { switch: true },
      });
      const ll = [];
      pdInfoDtosList.map((item, index) => {
        if (item.recvOrdAddPdId) {
          ll.push(item);
        }
      });
      dispatch({
        type: 'addempreceiptrec/newpdInfoDtosList',
        payload: ll,
      });
      dispatch({
        type: 'addempreceiptrec/updateModalData',
        payload: { switch: true },
      });
      this.setState({
        pdInfoDtosList,
        // eslint-disable-next-line react/no-unused-state
        pdInfoDtosListtwo: ll,
      });
    }
  };

  // 缴纳明细弹框
  detailed = () => {
    const { dispatch, location } = this.props;
    const { recvOrdAddTaskId } = location.query;
    dispatch({
      type: 'addempreceiptrec/getPaymentDetails',
      payload: { recvOrdAddTaskId },
    });

    this.setState({
      maistrue: true,
    });
  };

  moneytype = e => {
    this.setState({
      opsitTypename: e,
    });
  };

  messagesModify = () => {
    const { dispatch, data } = this.props;
    if (this.state.isModifyor == '1') {
      dispatch({
        type: 'addempreceiptrec/perprotype',
        payload: { areaId: data.sendOrdDetailDto.cityId },
        callback: response => {
          if (response.success) {
            this.setState({
              // eslint-disable-next-line react/no-unused-state
              catepaympersol: response.data,
            });
          } else {
            message.warning(response.message || '暂无数据');
          }
        },
      });
      this.setState({
        isModifyor: '2',
      });
    } else {
      const getFieldsList = this.props.form.getFieldsValue();
      const paramet = {
        recvOrdTaskId: this.state.recvTaskId,
        recvIdeId: this.state.opsitTypename,
      };

      dispatch({
        type: 'addempreceiptrec/modification',
        payload: paramet,
        callback: response => {
          if (response.success == true) {
            message.success('修改成功！');
            this.handleModalVisible(false);
            dispatch({
              type: 'addempreceiptrec/updateModalData',
              payload: { switch: true },
            });
            dispatch({
              type: 'addempreceiptrec/receiptback',
              payload: { recvOrdAddTaskId: this.state.recvTaskId },
            });
          } else {
            message.warning(response.message || '修改失败!');
            this.handleModalVisible(false);
            dispatch({
              type: 'addempreceiptrec/updateModalData',
              payload: { switch: true },
            });
            dispatch({
              type: 'addempreceiptrec/receiptback',
              payload: { recvOrdAddTaskId: this.state.recvTaskId },
            });
          }
        },
      });
      this.setState({
        isModifyor: '1',
      });
    }
  };

  // 关闭缴纳明细弹框
  handleOk = () => {
    this.setState({
      maistrue: false,
    });
  };

  changetime = e => {
    const currentDate = moment(e).format('YYYY-MM-01');
    this.setState({
      currentDate,
    });
  };

  // 修改提交
  submitData = () => {
    const { dispatch } = this.props;

    const getFieldsList = this.props.form.getFieldsValue();
    this.props.form.validateFields(['bigenTime', 'product'], (err, values) => {
      if (!err) {
        const times = getFieldsList.bigenTime ? getFieldsList.bigenTime.format('YYYYMM01') : null;

        if (this.state.recvOrdPdId.length > 0) {
          // eslint-disable-next-line no-var
          var paramet = {
            recvBeginYm: times,
            remark: getFieldsList.product,
            recvOrdTaskId: this.state.recvTaskId,
            recvOrdPdId: this.state.recvOrdPdId,
          };
        } else {
          // eslint-disable-next-line no-var
          var paramet = {
            recvBeginYm: times,
            remark: getFieldsList.product,
            recvOrdTaskId: this.state.recvTaskId,
            recvOrdSetId: this.state.recvOrdSetId,
          };
        }

        dispatch({
          type: 'addempreceiptrec/modification',
          payload: paramet,
          callback: response => {
            if (response.success == true) {
              message.success('修改成功！');
              this.handleModalVisible(false);
              dispatch({
                type: 'addempreceiptrec/updateModalData',
                payload: { switch: true },
              });
              dispatch({
                type: 'addempreceiptrec/receiptback',
                payload: { recvOrdAddTaskId: this.state.recvTaskId },
              });
            } else {
              message.warning(response.message || '修改失败!');
              this.handleModalVisible(false);
            }
          },
        });
      }
    });
  };

  // 点击修改缴费人员类别 author-xxl
  editInsIdeName = () => {
    this.setState({ ideModalVisible: true });
    const { dispatch, data, form } = this.props;
    form.resetFields(['insIde', 'remark']);
    if (data.pdInfoDtos) {
      data.pdInfoDtos.map(pditem => {
        if (pditem.pdId === 'PDINF_0000000001') {
          // 社保代缴服务
          dispatch({
            type: 'addempreceiptrec/getInsIdeList',
            payload: {
              areaId: pditem.cityId,
            },
          }).then(response => {
            if (response.success) {
              this.setState({
                insIdeData: response.data,
              });
            } else {
              message.warning(response.message || '获取缴费人员类别失败：服务器端错误');
            }
          });
        }
      });
    }
  };

  // 禁用日期
  disabledDate = (startValue, limitDate) => startValue.valueOf() < moment(limitDate).valueOf();

  // 缴费人员类别选中 author-xxl
  insIdeChange = value => {
    this.setState({ insIde: value });
  };

  // 保存缴费人员类别 author-xxl
  saveContributorCategory = () => {
    const { dispatch, form } = this.props;
    const { recvTaskId } = this.state;
    form.validateFields(['insIde', 'remark'], (err, values) => {
      if (!err) {
        dispatch({
          type: 'addempreceiptrec/updateInsIde',
          payload: {
            recvOrdTaskId: recvTaskId,
            insIde: values.insIde,
            remark: values.remark, // 变更说明
          },
        }).then(response => {
          if (response.success) {
            message.success('修改成功！');
            dispatch({
              type: 'addempreceiptrec/receiptback',
              payload: {
                recvOrdAddTaskId: recvTaskId,
              },
            });
            this.setState({ ideModalVisible: false });
          } else {
            message.warning(response.message || '修改缴费人员类别失败：服务器端错误');
          }
        });
      }
    });
  };

  // 取消回单
  cancelReceipt = record => {
    const { dispatch } = this.props;
    const { recvTaskId } = this.state;
    const receArr = [];
    receArr.push(recvTaskId);
    dispatch({
      type: 'addempdetailreceive/cancelReturnReceipt',
      payload: record.ass
        ? { ass: record.ass, recvOrdAddTaskId: receArr }
        : { pdId: record.pdId, recvOrdAddTaskId: receArr },
      callback: response => {
        if (response.success) {
          message.success('取消回单成功！');
          dispatch({
            type: 'addempreceiptrec/updateModalData',
            payload: { switch: true },
          });
          dispatch({
            type: 'addempreceiptrec/receiptback',
            payload: { recvOrdAddTaskId: recvTaskId },
          });
        } else {
          message.warning(response.message || '服务器端错误');
        }
      },
    });
  };

  render() {
    const {
      modalVisible,
      ideModalVisible,
      insIdeData,
      currentDate,
      timeStart,
      limitTimeStart,
    } = this.state;
    const ll = [];
    const {
      data,
      loading,
      form: { getFieldDecorator },
      pdInfoDtos,
      payDetailsData,
      confirmLoading,
      switchs,
      insFlag,
    } = this.props;
    const newPdInfoDtos = [];
    if (data.pdInfoDtos) {
      data.pdInfoDtos.map((pditem, pdindex) => {
        newPdInfoDtos.push(pditem);
      });
    }
    this.setState({
      setInfosList: data.setInfos,
      pdInfoDtosList: data.pdInfoDtos,
    });
    const formItemLayout = {
      labelCol: { span: 6 },
      wrapperCol: { span: 14 },
    };
    const formItemLayouts = {
      labelCol: { span: 8 },
      wrapperCol: { span: 14 },
    };
    const insAccuColumnsthree = [
      {
        title: '险种',
        width: 300,
        dataIndex: 'assName',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: value => value || '--',
      },
      {
        title: '缴费方式',
        width: 300,
        dataIndex: 'payWayName',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: value => value || '--',
      },
      {
        title: '缴费账户',
        width: 300,
        dataIndex: 'accoName',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: value => value || '--',
      },
      {
        title: '申报工资',
        width: 150,
        dataIndex: 'decWage',
        align: 'right',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: value => value || '--',
      },

      {
        title: '政策组合',
        dataIndex: 'grpName',
        width: 300,
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: value => value || '--',
      },
    ];

    const insAccuColumns = [
      {
        title: '产品名称',
        dataIndex: 'assName',
        align: 'center',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
      },
      {
        title: '业务开始日期',
        dataIndex: 'beginDate',
        align: 'center',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: beginDate => (beginDate && moment(beginDate).format('YYYY-MM-01')) || '--',
      },
      {
        title: '业务结束日期',
        dataIndex: 'endDate',
        align: 'center',
        sorter: (a, b) => new Date(b.endDate) - new Date(a.endDate),
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        // eslint-disable-next-line consistent-return
        render: val => {
          if (val && val && moment(val).format('YYYY-MM-01')) {
            // eslint-disable-next-line no-shadow
            const start = val && moment(val).format('YYYY-MM-01');
            const end = moment(start)
              .add('month', 1)
              .add('days', -1)
              .format('YYYY-MM-DD');
            return end;
            // eslint-disable-next-line no-else-return
          } else {
            return '无';
          }
        },
      },
      {
        title: '缴纳金额',
        dataIndex: 'payAmount',
        onHeaderCell: () => ({ style: { fontWeight: 'bold', textAlign: 'center' } }),
        onCell: () => ({ style: { textAlign: 'right' } }),
        render: val => val || (val === 0 ? 0 : null),
      },
      {
        title: '企业基数',
        dataIndex: 'entpBase',
        onHeaderCell: () => ({ style: { fontWeight: 'bold', textAlign: 'center' } }),
        onCell: () => ({ style: { textAlign: 'right' } }),
        render: val => val || (val === 0 ? 0 : null),
      },
      {
        title: '企业比例(%)',
        dataIndex: 'entpProp',
        align: 'center',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: val => val || (val === 0 ? 0 : null),
      },
      {
        title: '企业附加(元)',
        dataIndex: 'entpAddnAmo',
        onHeaderCell: () => ({ style: { fontWeight: 'bold', textAlign: 'center' } }),
        onCell: () => ({ style: { textAlign: 'right' } }),
        render: val => val || (val === 0 ? 0 : null),
      },
      {
        title: '企业缴费',
        dataIndex: 'entpPay',
        onHeaderCell: () => ({ style: { fontWeight: 'bold', textAlign: 'center' } }),
        onCell: () => ({ style: { textAlign: 'right' } }),
        render: val => val || (val === 0 ? 0 : null),
      },
      {
        title: '个人基数',
        dataIndex: 'perBase',
        onHeaderCell: () => ({ style: { fontWeight: 'bold', textAlign: 'center' } }),
        onCell: () => ({ style: { textAlign: 'right' } }),
        render: val => val || (val === 0 ? 0 : null),
      },
      {
        title: '个人比例(%)',
        dataIndex: 'perProp',
        align: 'center',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: val => val || (val === 0 ? 0 : null),
      },
      {
        title: '个人附加(元)',
        dataIndex: 'perAddnAmo',
        onHeaderCell: () => ({ style: { fontWeight: 'bold', textAlign: 'center' } }),
        onCell: () => ({ style: { textAlign: 'right' } }),
        render: val => val || (val === 0 ? 0 : null),
      },
      {
        title: '个人缴费',
        dataIndex: 'perPay',
        onHeaderCell: () => ({ style: { fontWeight: 'bold', textAlign: 'center' } }),
        onCell: () => ({ style: { textAlign: 'right' } }),
        render: val => val || (val === 0 ? 0 : null),
      },
      {
        title: '执行地区',
        dataIndex: 'cityName',
        align: 'center',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
      },
    ];

    const columns = [
      {
        title: '产品',
        dataIndex: 'pdName',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
      },
      {
        title: '执行地',
        dataIndex: 'cityName',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
      },
      {
        title: '业务开始日期',
        dataIndex: 'sendBeginDate',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: sendBeginDate => moment(sendBeginDate).format('YYYY-MM-01'),
      },
      {
        title: '修改说明',
        dataIndex: 'editDesc',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: val => {
          if (val) {
            return val;
            // eslint-disable-next-line no-else-return
          } else {
            return '--';
          }
        },
      },

      {
        title: '操作',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: (text, record) => (
          <div>
            {/* isModify：1是修改。2是回单 */}
            {record.pdId == 'PDINF_0000000001' ? (
              <div>
                {this.state.isModify == 2 && record.receFlag == 2 && insFlag === 1 ? (
                  <span>
                    {switchs ? (
                      <a
                        style={{ marginRight: '10px' }}
                        onClick={() => {
                          this.receipt(record);
                        }}
                      >
                        回单
                      </a>
                    ) : null}
                  </span>
                ) : null}
                {switchs ? (
                  <span>
                    {this.state.isModify == 2 && record.receFlag === 1 ? (
                      <a
                        style={{ marginRight: '10px' }}
                        onClick={() => {
                          this.cancelReceipt(text, record);
                        }}
                      >
                        取消回单
                      </a>
                    ) : null}
                  </span>
                ) : null}

                {switchs ? (
                  <span>
                    {/* 没有回单并且险种也没有回单 */}
                    {record.receFlag === 2 && insFlag === 1 ? (
                      <a
                        style={{ marginRight: '10px' }}
                        onClick={() => {
                          this.update(record);
                        }}
                      >
                        修改
                      </a>
                    ) : null}
                  </span>
                ) : null}
                {switchs ? (
                  <a
                    onClick={() => {
                      this.subsett(record);
                    }}
                  >
                    {this.state.isModify == '1' && record.receFlag === 2 ? (
                      <span>{data.setInfos.length > 0 ? '分项修改' : '--'}</span>
                    ) : (
                      <span>
                        {data && data.setInfos && data.setInfos.length == 0 ? null : '分项设置'}
                      </span>
                    )}
                  </a>
                ) : (
                  <a
                    onClick={() => {
                      this.subsett(record);
                    }}
                  >
                    {this.state.isModify == '1' ? '取消分项修改' : '取消分项设置'}
                  </a>
                )}
              </div>
            ) : (
              <div>
                {record.pdId == 'PDINF_0000000002' ? (
                  <div>
                    {this.state.isModify == 2 && record.receFlag == 2 ? (
                      <a
                        style={{ marginRight: '10px' }}
                        onClick={() => {
                          this.receipt(record);
                        }}
                      >
                        回单
                      </a>
                    ) : null}
                    {this.state.isModify == 2 && record.receFlag === 1 ? (
                      <a
                        onClick={() => {
                          this.cancelReceipt(text, record);
                        }}
                      >
                        取消回单
                      </a>
                    ) : null}

                    {record.receFlag === 2 ? (
                      <a
                        onClick={() => {
                          this.update(record);
                        }}
                      >
                        修改
                      </a>
                    ) : null}
                  </div>
                ) : (
                  record &&
                  record.ass && (
                    <div>
                      {this.state.isModify == 2 && record.receFlag == 2 ? (
                        <a
                          style={{ marginRight: '10px' }}
                          onClick={() => {
                            this.receipt(record);
                          }}
                        >
                          回单
                        </a>
                      ) : null}
                      {this.state.isModify == 2 && record.receFlag === 1 ? (
                        <a
                          onClick={() => {
                            this.cancelReceipt(text, record);
                          }}
                        >
                          取消回单
                        </a>
                      ) : null}
                      {record.receFlag === 1 ? null : (
                        <a
                          onClick={() => {
                            this.update(record);
                          }}
                        >
                          修改
                        </a>
                      )}
                    </div>
                  )
                )}
              </div>
            )}
          </div>
        ),
      },
    ];
    return (
      <PageHeaderWrapper>
        <Spin tip="Loading..." spinning={loading}>
          <Card
            title={
              <span style={{ fontWeight: 'bolder' }} id="sendInfor">
                员工信息
              </span>
            }
            bordered={false}
          >
            {data.sendOrdDetailDto ? (
              <DescriptionList>
                <Description term="姓名">{data.sendOrdDetailDto.empName || '--'}</Description>
                <Description term="证件类型">
                  {data.sendOrdDetailDto.idTypeName || '--'}
                </Description>
                <Description term="证件号">{data.sendOrdDetailDto.idCode || '--'}</Description>
                <Description term="国籍">{data.sendOrdDetailDto.nationName || '--'}</Description>
                <Description term="出生日期">
                  {moment(data.sendOrdDetailDto.birthDate).format('YYYY-MM-DD') || '--'}
                </Description>
                <Description term="性别">{data.sendOrdDetailDto.genderName || '--'}</Description>
                <Description term="电话">{data.sendOrdDetailDto.mobile || '--'}</Description>
                <Description term="员工邮箱">{data.sendOrdDetailDto.email || '--'}</Description>
              </DescriptionList>
            ) : null}
            <div style={{ borderBottom: '1px dashed #ccc', margin: '20px 0' }} />
            <div style={{ marginTop: 24 }} bordered={false}>
              {data.sendOrdDetailDto ? (
                <DescriptionList>
                  {/* <Description term="客户名称">{data.sendOrdDetailDto.custName}</Description> */}
                  <Description term="签约方">
                    {data.sendOrdDetailDto.sendSuppName || '--'}
                  </Description>
                  <Description term="客户名称">
                    {data.sendOrdDetailDto.custName || '--'}
                  </Description>
                  <Description term="入职日期">
                    {(data.sendOrdDetailDto.entryDate &&
                      moment(data.sendOrdDetailDto.entryDate).format('YYYY-MM-DD')) ||
                      '--'}
                  </Description>
                  <Description term="是否入职联系">
                    {data.sendOrdDetailDto.conEmpFlagName || '--'}
                  </Description>
                  <Description term="操作人">{data.sendOrdDetailDto.operName || '--'}</Description>
                  <Description term="发单时间">
                    {(data.sendOrdDetailDto.hairOrdDate &&
                      moment(data.sendOrdDetailDto.hairOrdDate).format('YYYY-MM-DD HH:mm')) ||
                      '--'}
                  </Description>
                </DescriptionList>
              ) : null}
            </div>
          </Card>

          <Card
            title={
              <div style={{ position: 'relative' }}>
                <span style={{ fontWeight: 900 }}>社保公积金信息</span>
                <a onClick={this.detailed} style={{ position: 'absolute', top: '0', right: '0' }}>
                  缴纳明细
                </a>
              </div>
            }
            style={{
              border: '0px',
              marginBottom: 24,
              marginTop: 24,
              color: '#262626',
            }}
          >
            {data.addEmpDetSerDto && data.addEmpDetSerDto.insIdeFlag === 1 && (
              <DescriptionList>
                <Description term="缴费人员类别">
                  {(data.addEmpDetSerDto && data.addEmpDetSerDto.insIdeName) || '--'}
                  <a style={{ marginLeft: 20 }} onClick={() => this.editInsIdeName()}>
                    修改
                  </a>
                </Description>
              </DescriptionList>
            )}
            <div>
              <Table
                dataSource={(data.addEmpDetSerDto && data.addEmpDetSerDto.detailSerDtos) || []}
                columns={insAccuColumnsthree}
                pagination={false}
                style={{ width: 900, marginTop: '15px' }}
              />
            </div>
            {/* ) : (
            <Form>
              <DescriptionList style={{ marginBottom: 24 }}>
                <Description term="社保申报工资">
                  {data.addEmpDetSerDto && data.addEmpDetSerDto.basicSerDto
                    ? data.addEmpDetSerDto.basicSerDto.insDecWage
                    : '--'}
                </Description>
                <Description term="社保缴费方式">
                  {data.addEmpDetSerDto && data.addEmpDetSerDto.basicSerDto
                    ? data.addEmpDetSerDto.basicSerDto.insPayFlag
                    : '--'}
                </Description>
                <Description term="社保账户">
                  {data.addEmpDetSerDto && data.addEmpDetSerDto.basicSerDto
                    ? data.addEmpDetSerDto.basicSerDto.insAccoName
                    : '--'}
                </Description>
              </DescriptionList>
              <DescriptionList style={{ marginBottom: 24 }}>
                <Description term="社保组合">
                  {data.addEmpDetSerDto && data.addEmpDetSerDto.basicSerDto
                    ? data.addEmpDetSerDto.basicSerDto.insGrpName
                    : '--'}
                </Description>
                {this.state.isModifyor == '1' ? (
                  <Description term="缴费人员类别">
                    {data.addEmpDetSerDto && data.addEmpDetSerDto.basicSerDto
                      ? data.addEmpDetSerDto.basicSerDto.insIde
                      : '--'}
                  </Description>
                ) : (
                  <Description term="缴费人员类别">
                    <Select
                      placeholder="请选择"
                      onChange={this.moneytype}
                      value={this.state.opsitTypename}
                    >
                      {this.state.catepaympersol
                        ? this.state.catepaympersol.map((item, index) => (
                            // eslint-disable-next-line react/jsx-no-undef
                            // eslint-disable-next-line react/jsx-indent
                            <Option key={item.ideId} value={item.ideId}>
                              {item.ideName}
                            </Option>
                          ))
                        : null}
                    </Select>
                  </Description>
                )}
              </DescriptionList>
              <DescriptionList style={{ marginBottom: 24 }}>
                <Description term="公积金申报工资">
                  {data.addEmpDetSerDto && data.addEmpDetSerDto.basicSerDto
                    ? data.addEmpDetSerDto.basicSerDto.accuDecWage
                    : '--'}
                </Description>
                <Description term="公积金缴费方式">
                  {data.addEmpDetSerDto && data.addEmpDetSerDto.basicSerDto
                    ? data.addEmpDetSerDto.basicSerDto.accuPayFlag
                    : '--'}
                </Description>
                <Description term="公积金账户">
                  {data.addEmpDetSerDto && data.addEmpDetSerDto.basicSerDto
                    ? data.addEmpDetSerDto.basicSerDto.accuAccoName
                    : '--'}
                </Description>
              </DescriptionList>
              <DescriptionList style={{ marginBottom: 24 }}>
                <Description term="公积金组合">
                  {data.addEmpDetSerDto && data.addEmpDetSerDto.basicSerDto
                    ? data.addEmpDetSerDto.basicSerDto.accuGrpName
                    : '--'}
                </Description>
              </DescriptionList>
            </Form>
          )} */}
          </Card>

          <Card
            style={{ marginTop: '20px' }}
            title={
              <span style={{ fontWeight: 'bolder' }} id="sendInfor">
                产品服务信息
              </span>
            }
            // style={{ marginBottom: 26 }}
            bordered={false}
          >
            <div>
              {this.state.pdInfoDtosList
                ? this.state.pdInfoDtosList.map((item, index) => {
                    if (item.recvOrdAddPdId) {
                      ll.push(item);
                    }
                  })
                : null}
            </div>
            <Table columns={columns} dataSource={newPdInfoDtos} pagination={false} />
          </Card>
          <Modal
            width={800}
            title="修改"
            visible={modalVisible}
            okText="确定"
            cancelText="取消"
            onOk={this.submitData}
            onCancel={() => this.handleModalVisible(false)}
            destroyOnClose
          >
            <Form>
              <div style={{ float: 'left', width: '350px' }}>
                <p style={{ lineHeight: '1px' }}>
                  签约方：
                  {data.sendOrdDetailDto && data.sendOrdDetailDto.sendSuppName
                    ? data.sendOrdDetailDto.sendSuppName
                    : null}
                </p>
                <p style={{ margin: '45px 0 0 0' }}>
                  业务开始日期：{moment(this.state.timeStart).format('YYYY-MM-01')}
                  {/* {moment(this.state.timeStart).format('YYYY-MM')} */}
                </p>
              </div>
              <div style={{ float: 'left', width: '350px' }}>
                <p style={{ lineHeight: '1px', margin: '0 0 40px 0' }}>
                  接单方：
                  {data.sendOrdDetailDto && data.sendOrdDetailDto.recvSuppName
                    ? data.sendOrdDetailDto.recvSuppName
                    : null}
                </p>
                <FormItem {...formItemLayouts} label="业务开始日期">
                  {getFieldDecorator('bigenTime', {
                    rules: [{ required: true, message: '请选择' }],
                    initialValues: '',
                  })(
                    <MonthPicker
                      onChange={e => this.changetime(e)}
                      format={this.state.currentDate}
                      disabledDate={startValue => this.disabledDate(startValue, limitTimeStart)}
                    />
                  )}
                </FormItem>
                <FormItem {...formItemLayout} label="变更说明">
                  {getFieldDecorator('product', {
                    rules: [{ required: true, message: '请输入' }],
                  })(<Input placeholder="请输入" maxLength={100} />)}
                </FormItem>
              </div>
            </Form>
          </Modal>
          <FooterToolbar style={{ width: '100%' }}>
            <Link to="/receiveordermanage/addemployee/index">
              <Button style={{ marginRight: 10 }}>关闭</Button>
            </Link>
          </FooterToolbar>
          <Modal
            width="1200px"
            visible={this.state.maistrue}
            onCancel={this.handleOk}
            title="社保公积金明细"
            footer={[
              <Button key="submit" type="primary" onClick={this.handleOk}>
                关闭
              </Button>,
            ]}
          >
            <Card>
              <Table
                dataSource={payDetailsData}
                columns={insAccuColumns}
                rowKey={record => record.serSetId}
                pagination={false}
              />
            </Card>
          </Modal>
          <Modal
            width={500}
            title="修改缴费人员类别"
            visible={ideModalVisible}
            okText="确定"
            onOk={this.saveContributorCategory}
            onCancel={() => this.setState({ ideModalVisible: false })}
            destroyOnClose
            confirmLoading={confirmLoading}
          >
            <Form layout="horizontal">
              <FormItem {...formItemLayout} label="缴费人员类别">
                {getFieldDecorator('insIde', {
                  rules: [{ required: true, message: '请选择' }],
                })(
                  <Select placeholder="请选择" onChange={this.insIdeChange()}>
                    {insIdeData
                      ? insIdeData.map(item => (
                          <Option key={item.ideId} value={item.ideId}>
                            {item.ideName}
                          </Option>
                        ))
                      : null}
                  </Select>
                )}
              </FormItem>
              <FormItem {...formItemLayout} label="变更说明">
                {getFieldDecorator('remark', {
                  rules: [{ required: true, message: '请选择' }],
                })(<TextArea rows={2} placeholder="请输入" />)}
              </FormItem>
            </Form>
          </Modal>
        </Spin>
      </PageHeaderWrapper>
    );
  }
}

export default TableList;
